import { reactive } from 'vue'
import { VxeGridProps } from 'vxe-table'
interface Column {
  field: string
  type?: string
  title?: string
  width?: string
  formatter?: Function
}

interface Rows {
  type: string
  name: string
  content: string
  date: string
}

const gridOptions = reactive<VxeGridProps<Rows>>({
  border: true,
  height: 100,
  align: 'center',
  loading: false,
  columnConfig: {
    resizable: true,
  },
  columns: [
    { field: 'type', title: '操作类型' },
    { field: 'name', title: '操作员' },
    { field: 'content', title: '操作内容' },
    { field: 'date', title: '操作时间', width: 200 },
  ],
  data: [],
})

const perGridOptions = reactive<VxeGridProps>({
  border: true,
  height: 100,
  align: 'center',
  loading: false,
  columnConfig: {
    resizable: true,
  },
  columns: [
    { field: 'employeeNumber', title: '员工编号' },
    { field: 'name', title: '人员姓名' },
    { field: 'contactInfo', title: '联系方式' },
    { field: 'contactAddress', title: '联系地址' },
    {
      field: 'entryTime',
      title: '进站时间',
      formatter: ['formatDate', 'yyyy-MM-dd'],
    },
    {
      field: 'workStatusLabel',
      title: '工作状态',
    },
    {
      field: 'workUnitName',
      title: '工作单位',
    },
    {
      field: 'title',
      title: '职称',
    },
    {
      field: 'position',
      title: '职务',
      width: '135px',
    },
    {
      field: 'expertLevel',
      title: '专家等级',
      width: '135px',
    },
    { title: '操作', width: 300, slots: { default: 'operate' } },
  ],
  data: [],
})

interface reportRows {
  projectName: string
  quarter: string
  taskScheduling: string
  completion: string
  status: string
}

const reportOptions = reactive<VxeGridProps<reportRows>>({
  border: true,
  height: 300,
  align: 'center',
  loading: false,
  columnConfig: {
    resizable: true,
  },
  columns: [
    { title: '序号', type: 'seq', width: 50 },
    { field: 'projectName', title: '项目名称', width: 200 },
    { field: 'quarterNumber', title: '季度', width: 200 },
    { field: 'taskPlan', title: '任务计划' },
    { field: 'completionDescription', title: '完成情况' },
    {
      field: 'status',
      title: '填写状态',
      formatter({ cellValue }) {
        return cellValue === '1' ? '未填写' : '已填写'
      },
      width: 100,
    },
    { title: '操作', width: 300, slots: { default: 'operate' } },
  ],
  data: [
    {
      projectName: 'xxxxxx',
      quarter: '2023年3季度',
      taskScheduling: 'xxxxxxxxxxxxxxxxxxxx',
      completion: 'xxxxxxxxxxxxxxxxxxxx',
      status: '0',
    },
  ],
})

const honorsOptions = reactive<VxeGridProps<any>>({
  border: true,
  loading: false,
  height: 300,
  columns: [],
  data: [],
  columnConfig: {
    resizable: true,
  },
})

export { gridOptions, reportOptions, honorsOptions, perGridOptions }
